<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>html</title>
	<link rel="stylesheet" type="text/css" href="../../js/easyui/themes/bootstrap/easyui.css">
	<link rel="stylesheet" type="text/css" href="../../js/easyui/themes/icon.css">
	<link rel="stylesheet" type="text/css" href="../../js/selfcss/demo.css">
	<script type="text/javascript" src="../../js/easyui/jquery.min.js"></script>
	<script type="text/javascript" src="../../js/easyui/jquery.easyui.min.js"></script>
</head>
	<body class="easyui-layout" fit="true" id="body" >
        <div data-options="region:'north',title:'查询条件',hideCollapsedContent:false,collapsed:false" style="height:80px;" id="north">
          <div style="width: 65%;float:left;">
           <form id="ff" style="text-align: center;margin-top: 15px;margin-left: 15px;" method="post"> 
		    	<table cellpadding="0" cellspacing="0" class="table-striped">
		    		<tr>
		    		   		    		   
		    		      <td>服务器：</td>
		    		      <td>
		    			  <input name="redisServerHost" id="redisServerHost" type="text" class="easyui-validatebox txt"/>
		    			 </td>
		    		   
		    		   
		    		   
		    		   
		    		</tr>
		    	</table>
		    </form>
          </div>
          <div style="width: 30%;float:right;margin-top: 15px;">
            <a href="javascript:Handler.searchData()" class="easyui-linkbutton"  style="width:80px">查询</a>
            <a href="javascript:Handler.resetFormData()" class="easyui-linkbutton"  style="width:80px">重置</a>
          </div>
        </div>
        
        <div data-options="region:'center',split:false" >
			<table id="tablelist" class="easyui-datagrid"  style="width:auto;" fitcolumns="true" fit="true" 
			data-options="singleSelect:true,pagination:true,url:'../../searchRedisClusterMonitorLogs',method:'get',toolbar:toolbar">
				<thead>
					<tr>					   
					    <th data-options="field:'ck',checkbox:true"></th>
						<th data-options="field:'redisServerHost',width:100,align:'center'">服务器</th>
						<th data-options="field:'redisServerPort',width:100,align:'center'">端口号</th>
						<th data-options="field:'remark',width:260,align:'center'">描述</th>
						<th data-options="field:'createTimeString',width:100,align:'center'">创建时间</th>
					</tr>
				</thead>
			</table>
		</div>
		
		<script type="text/javascript">
        var toolbar = [{
            text:'删除',
            iconCls:'icon-cut',
            handler:function(){Handler.deleteData()}
        }];
      //设置分页控件  
      $(document).ready(function() {
    	  var p = $('#tablelist').datagrid('getPager');  
          p.pagination({  
              pageSize: 10,//每页显示的记录条数，默认为10  
              pageList: [10, 20, 50],//可以设置每页记录条数的列表  
              beforePageText: '第',//页数文本框前显示的汉字  
              afterPageText: '页    共 {pages} 页',  
              displayMsg: '当前显示 {from} - {to} 条记录   共 {total} 条记录'  
          });  
      });
      var Handler = {
    			deleteData: function(){ 
      			  var rowsChecked = $('#tablelist').datagrid('getChecked');
      			  $.messager.confirm('信息提示', '确认是否删除数据?', function(r){
      	                if (r){
      	                	$.post("../../removeRedisClusterMonitorLog",{id:rowsChecked[0].id},function(data,state){
      	    					 if(state=="success" && data.status==200){
      	    						 $('#tablelist').datagrid('reload'); 
      	    						 $('#ff').form('clear');
      	    					 }else{
      	    						 $.messager.alert('失败信息',data.message,'error');
      	    					 }	
      	  					},"json");
      	                }
      	            }); 
      			},
      		  resetFormData: function(){
      			$('#ff').form('clear');
      		  },
      		  searchData: function(){
      			  var params=getFormData("ff");
      			  $('#tablelist').datagrid('load',params);
      		  }
      		
      };
      function getFormData(id){
    	    var data = $("#"+id).serializeArray();
    		var item,key,value,newData={};
    		for(var i=0;i<data.length;i++){
    			item = data[i];
    			key = item.name;
    			if(item.value){
    				value = item.value;
        			newData[key] = value;
    			}
    		}	
    		return newData;
    	}
      
      function openWindow(id,title,iconcls){
    	  $('#'+id).window({
			    width:850,
			    height:400,
			    top:($("#body").height() - 400) * 0.5,   
              	left:($("#body").width() - 800) * 0.5,
              	shadow: true,
              	collapsible:false,
              	minimizable:false,
              	maximizable:false,
              	iconCls:iconcls,
			    title:title,
			    modal:true
			});
			 $('#'+id).window('open');
      }
    </script>
		
	</body>
	
</html>